import { ref } from 'vue'
import { ElMessage } from 'element-plus'
import request from '@/utils/request'

export function useFileUpload() {
  const uploadLoading = ref(false)
  const fileList = ref([])

  // 处理文件选择
  const handleFileSelect = (file) => {
    // 检查文件对象是否有效
    if (!file || !file.raw) {
      console.error('无效的文件对象:', file)
      ElMessage.error('文件无效')
      return false
    }

    const rawFile = file.raw

    // 检查文件大小（10MB）
    const isLt10M = rawFile.size / 1024 / 1024 < 10
    if (!isLt10M) {
      ElMessage.error('文件大小不能超过 10MB!')
      return false
    }

    // 获取文件扩展名
    const extension = rawFile.name.split('.').pop().toLowerCase()
    const allowedExtensions = ['jpg', 'jpeg', 'png', 'gif', 'pdf', 'doc', 'docx', 'xls', 'xlsx']
    
    // 调试信息
    console.log('文件信息:', {
      name: rawFile.name,
      type: rawFile.type,
      extension: extension,
      size: rawFile.size
    })

    // 只检查文件扩展名
    if (!allowedExtensions.includes(extension)) {
      ElMessage.error('只能上传 JPG/PNG/GIF/PDF/DOC/DOCX/XLS/XLSX 格式的文件!')
      return false
    }

    // 创建文件预览
    try {
    const reader = new FileReader()
    reader.onload = () => {
      fileList.value = [{
          name: rawFile.name,
        url: reader.result,
          raw: rawFile
      }]
    }
      reader.onerror = (error) => {
        console.error('文件读取错误:', error)
        ElMessage.error('文件读取失败')
      }
      reader.readAsDataURL(rawFile)
    } catch (error) {
      console.error('文件处理错误:', error)
      ElMessage.error('文件处理失败')
      return false
    }

    return false // 阻止自动上传
  }

  // 上传文件
  const uploadFile = async (path = '', file = null) => {
    let uploadFileObj = file
    if (!uploadFileObj) {
      if (!fileList.value.length) return null
      uploadFileObj = fileList.value[0].raw
    }
    if (!uploadFileObj) return null

    uploadLoading.value = true
    try {
      const formData = new FormData()
      formData.append('file', uploadFileObj)
      if (path) {
        formData.append('path', path)
      }
      const res = await request.post('/files/upload', formData, {
        headers: { 'Content-Type': 'multipart/form-data' }
      })
      if (res.code === '0') {
        ElMessage.success('上传成功')
        return res.data
      } else {
        ElMessage.error(res.msg || '上传失败')
        return null
      }
    } catch (error) {
      ElMessage.error('上传失败')
      return null
    } finally {
      uploadLoading.value = false
    }
  }

  // 删除文件
  const deleteFile = async (path, fileName) => {
    try {
      // 使用 encodeURI 而不是 encodeURIComponent
      const encodedPath = encodeURI(path)
      const encodedFileName = encodeURI(fileName)
      
      console.log('删除文件请求:', {
        path: encodedPath,
        fileName: encodedFileName,
        url: `/files/${encodedPath}/${encodedFileName}`
      })

      const res = await request.delete(`/files/${encodedPath}/${encodedFileName}`, {
        headers: {
          'Content-Type': 'application/json',
          'Accept': 'application/json'
        }
      })
      
      if (res.code === '0') {
        ElMessage.success('删除成功')
        return true
      } else {
        ElMessage.error(res.msg || '删除失败')
        return false
      }
    } catch (error) {
      console.error('删除文件错误:', error)
      if (error.response) {
        console.error('错误状态码:', error.response.status)
        console.error('错误信息:', error.response.data)
        console.error('错误头信息:', error.response.headers)
      } else if (error.request) {
        console.error('请求错误:', error.request)
      }
      ElMessage.error(error.response?.data?.msg || '删除失败')
      return false
    }
  }

  // 替换文件
  const replaceFile = async (file, oldFilePath) => {
    if (!file || !file.raw) {
      console.error('无效的文件对象:', file)
      ElMessage.error('文件无效')
      return null
    }

    uploadLoading.value = true
    try {
      const formData = new FormData()
      formData.append('file', file.raw)
      formData.append('oldFilePath', oldFilePath)

      const res = await request.post('/files/replace', formData, {
        headers: {
          'Content-Type': 'multipart/form-data'
        }
      })

      if (res.code === '0') {
        ElMessage.success('文件替换成功')
        return res.data
      } else {
        ElMessage.error(res.msg || '文件替换失败')
        return null
      }
    } catch (error) {
      console.error('文件替换错误:', error)
      if (error.response) {
        console.error('错误状态码:', error.response.status)
        console.error('错误信息:', error.response.data)
      }
      ElMessage.error(error.response?.data?.msg || '文件替换失败')
      return null
    } finally {
      uploadLoading.value = false
    }
  }

  // 清除文件列表
  const clearFiles = () => {
    fileList.value = []
  }

  return {
    uploadLoading,
    fileList,
    handleFileSelect,
    uploadFile,
    deleteFile,
    replaceFile,
    clearFiles
  }
} 